import { IPublicTypeComponentMetadata, IPublicTypeSnippet } from '@alilc/lowcode-types';

const TrafficPredictionMeta: IPublicTypeComponentMetadata = {
  componentName: 'TrafficPrediction',
  title: '客流预测',
  category: '出行服务',
  group: '出行服务',
  docUrl: '',
  screenshot: '',
  devMode: 'proCode',
  npm: {
    package: 'hzdz-charts',
    version: '0.1.0',
    exportName: 'TrafficPrediction',
    main: 'src/index.tsx',
    destructuring: true,
    subName: ''
  },
  props: [
    {
      name: 'ref',
      propType: 'object',
    },
    {
      name: 'key',
      propType: 'string',
    },
    {
      name: 'style',
      propType: 'object',
    },
  ],
  configure: {
    props: [
      // 基础属性
      {
        name: 'basic',
        type: 'group',
        display: 'accordion',
        title: {
          label: '基础属性',
        },
        items: [
          {
            name: 'width',
            title: {
              label: '宽度',
              tip: '组件宽度'
            },
            setter: 'NumberSetter',
            defaultValue: 500,
          },
          {
            name: 'height',
            title: {
              label: '高度',
              tip: '组件高度'
            },
            setter: 'NumberSetter',
            defaultValue: 503,
          },
          {
            name: 'noResponsiveScale',
            title: {
              label: '禁用响应式缩放',
              tip: '当父容器有缩放时，禁用子组件的响应式缩放'
            },
            setter: 'BoolSetter',
            defaultValue: true,
          },
        ]
      },
      // 状态栏配置
      {
        name: 'statusBar',
        type: 'group',
        display: 'accordion',
        title: {
          label: '状态栏配置',
        },
        items: [
          {
            name: 'statusBar.title',
            title: {
              label: '中文标题',
              tip: '状态栏显示的中文标题'
            },
            setter: 'StringSetter',
            defaultValue: '客流预测',
          },
          {
            name: 'statusBar.subtitle',
            title: {
              label: '英文标题',
              tip: '状态栏显示的英文标题'
            },
            setter: 'StringSetter',
            defaultValue: 'TRAFFIC PREDICTION',
          }
        ]
      },
      // 半小时预测配置
      {
        name: 'halfHourTitle',
        type: 'group',
        display: 'accordion',
        title: {
          label: '半小时预测配置',
        },
        items: [
          {
            name: 'halfHourTitle.title',
            title: {
              label: '标题',
              tip: '半小时预测区域的标题'
            },
            setter: 'StringSetter',
            defaultValue: '半小时预测客流',
          }
        ]
      },
      // 密度显示配置
      {
        name: 'densityDisplay',
        type: 'group',
        display: 'accordion',
        title: {
          label: '密度显示配置',
        },
        items: [
          {
            name: 'densityDisplay.moduleCount',
            title: {
              label: '模块数量',
              tip: '显示的模块数量'
            },
            setter: 'NumberSetter',
            defaultValue: 4,
          },
          {
            name: 'densityDisplay.data',
            title: {
              label: '数据配置',
              tip: '密度显示的数据配置'
            },
            setter: 'JsonSetter',
            defaultValue: [
              { icon: '🚂', label: '铁路', value: '1185人' },
              { icon: '🚇', label: '地铁', value: '118755人' },
              { icon: '🚌', label: '公交', value: '1185人' },
              { icon: '🚕', label: '出租车', value: '1185人' }
            ],
          }
        ]
      },
      // 48小时预测配置
      {
        name: 'fortyEightHourTitle',
        type: 'group',
        display: 'accordion',
        title: {
          label: '48小时预测配置',
        },
        items: [
          {
            name: 'fortyEightHourTitle.title',
            title: {
              label: '标题',
              tip: '48小时预测区域的标题'
            },
            setter: 'StringSetter',
            defaultValue: '48小时预测客流（昨日.今日）',
          }
        ]
      },
      // 折线图配置
      {
        name: 'lineChart',
        type: 'group',
        display: 'accordion',
        title: {
          label: '折线图配置',
        },
        items: [
          {
            name: 'lineChart.data',
            title: {
              label: '图表数据',
              tip: '折线图的数据'
            },
            setter: 'JsonSetter',
            defaultValue: [],
          },
          {
            name: 'lineChart.config',
            title: {
              label: '图表配置',
              tip: '折线图的配置项'
            },
            setter: 'JsonSetter',
            defaultValue: {},
          }
        ]
      }
    ],
    supports: {
      style: true,
      className: true,
    },
    component: {
      isContainer: false,
      isModal: false,
    },
  },
  icon: 'https://img.alicdn.com/imgextra/i4/O1CN01XCiY1B1UyR3MKMFvk_!!6000000002580-55-tps-200-200.svg',
  keywords: ['客流预测', 'traffic', 'prediction', 'chart', 'data'],
};

const snippets: IPublicTypeSnippet[] = [
  {
    title: '客流预测',
    screenshot: '',
    schema: {
      componentName: 'TrafficPrediction',
      props: {
        width: 500,
        height: 560,
        noResponsiveScale: true,
        statusBar: {
          title: '客流预测',
          subtitle: 'TRAFFIC PREDICTION'
        },
        halfHourTitle: {
          title: '半小时预测客流'
        },
        densityDisplay: {
          moduleCount: 4,
          data: [
            { icon: '🚂', label: '铁路', value: '1185人' },
            { icon: '🚇', label: '地铁', value: '118755人' },
            { icon: '🚌', label: '公交', value: '1185人' },
            { icon: '🚕', label: '出租车', value: '1185人' }
          ]
        },
        fortyEightHourTitle: {
          title: '48小时预测客流（昨日.今日）'
        },
        lineChart: {
          data: [],
          config: {}
        }
      }
    }
  }
];

export default {
  ...TrafficPredictionMeta,
  snippets
}; 